<script lang="ts" setup>
import {message} from 'ant-design-vue';
import type {IPageRequest, ISearchParams} from '@/types/request';

const {onSearchRequest, searchParams} = defineProps<{
    name: string
    showTime?: boolean
    searchParams: ISearchParams
    onSearchRequest: () => Promise<IPageRequest<any>>
}>()

async function handleSearchRequest() {
    try {
        // 搜索后重置显示第一页数据
        searchParams.page = 1
        const {data} = await onSearchRequest()
        searchParams.total = data.total_record
    } catch (error: any) {
        message.error(error.message || error)
    }
}
</script>

<template>
    <div flex="~ center" gap="2" m="b-6">
        <span flex="shrink-0">搜索{{ name }}：</span>
        <a-input v-model:value="searchParams.condition" @keypress.enter.native="handleSearchRequest"/>
        <a-button type="primary" @click="handleSearchRequest">搜索</a-button>
        <div v-if="showTime" flex="~ center shrink-0" gap="2">
            <a-time-picker v-model:value="searchParams.gmt_start" placeholder="开始时间"/>
            <a-time-picker v-model:value="searchParams.gmt_end" placeholder="结束时间"/>
        </div>
    </div>
</template>
